<template>
	<view>
		<view class="header status_bar" :class="scrrol == true ? 'scrrolHeader' : ''">
			<view class="back iconfont icon-xiangzuo1" @tap="backPage"></view>
			<view class="text" :class="scrrol == true ? 'scrrolHeader' : ''">{{Lang.lang('我的資產')}}</view>
			<view class="back"></view>
			<!-- <view class="rule">规则</view> -->
		</view>
		<view class="clear_box"></view>

		<view class="page_content">

			<view class="assets_list">
				<view class="type_box">
					<view class="icon">
						<image src="../../static/menu/menu12.png" mode="widthFix"></image>
					</view>
					<view class="title">USDT</view>
					<view class="text" data-url="/pages/personalcenter/money_list?type=1" @click="gotopage">{{Lang.lang('明細')}}</view>
					<view class="arrow iconfont icon-xiangyou1"></view>
				</view>
				<view class="num_box">{{user_info.usdt}}</view>
				<!-- <view class="menu_box">
					<view class="menu">
						<view class="name">可用資產</view>
						<view class="num">12000.92</view>
					</view>
					<view class="menu">
						<view class="name">凍結資產</view>
						<view class="num">12000.92</view>
					</view>
				</view> -->
				<view class="button_box">
					<view class="button buttonColor01" data-url="/pages/personalcenter/recharge?type=1"
						@click="gotopage">{{Lang.lang('充值')}}</view>
					<view class="button" data-url="/pages/personalcenter/withdraw?type=1" @click="gotopage">{{Lang.lang('提幣')}}</view>
				</view>
			</view>


			<view class="assets_list">
				<view class="type_box">
					<view class="icon">
						<image src="../../static/menu/menu13.png" mode="widthFix"></image>
					</view>
					<view class="title">YYDM</view>
					<view class="text" data-url="/pages/personalcenter/money_list?type=2" @click="gotopage">{{Lang.lang('明細')}}</view>
					<view class="arrow iconfont icon-xiangyou1"></view>
				</view>
				<view class="num_box">{{user_info.yydm}}</view>
				<!-- <view class="menu_box">
					<view class="menu">
						<view class="name">可用資產</view>
						<view class="num">12000.92</view>
					</view>
					<view class="menu">
						<view class="name">凍結資產</view>
						<view class="num">12000.92</view>
					</view>
				</view> -->
				<view class="button_box">
					<view class="button buttonColor02" data-url="/pages/personalcenter/recharge?type=2"
						@click="gotopage">{{Lang.lang('充值')}}</view>
					<view class="button" data-url="/pages/personalcenter/withdraw?type=2" @click="gotopage">{{Lang.lang('提幣')}}</view>
				</view>
			</view>


			<view class="assets_list">
				<view class="type_box">
					<view class="icon">
						<image src="../../static/menu/menu14.png" mode="widthFix"></image>
					</view>
					<view class="title">YYDZ</view>
					<view class="text" data-url="/pages/personalcenter/money_list?type=3" @click="gotopage">{{Lang.lang('明細')}}</view>
					<view class="arrow iconfont icon-xiangyou1"></view>
				</view>
				<view class="num_box">{{user_info.yydz}}</view>
				<!-- <view class="menu_box">
					<view class="menu">
						<view class="name">可用資產</view>
						<view class="num">12000.92</view>
					</view>
					<view class="menu">
						<view class="name">凍結資產</view>
						<view class="num">12000.92</view>
					</view>
				</view> -->
				<!-- <view class="button_box">
					<view class="button buttonColor03" :data-url="'/pages/personalcenter/recharge'" @click="gotopage">充幣</view>
					<view class="button" :data-url="'/pages/personalcenter/withdraw'" @click="gotopage">提幣</view>
					
				</view> -->
			</view>

		</view>



	</view>
</template>

<script>
	export default {
		data() {
			return {
				lang: 'en',
				link: '',
				pupu: false,
				scrrol: false,
				info: '',
				assetsList: [{
						name: 'USDT',
						img: '../../static/menu/menu12.png'
					},
					{
						name: 'YYDM',
						img: '../../static/menu/menu13.png'
					},
					{
						name: 'YYDZ',
						img: '../../static/menu/menu14.png'
					}
				],
				user_info: {
					usdt: 0,
					yydm: 0,
					yydz: 0
				}
			}
		},
		onLoad() {

		},
		onShow() {
			let that = this;
			that.loadData();
		},
		methods: {
			loadData() {
				let that = this;
				that.Net._post('api/user/getUserInfo', {}, res => {
					if (res.code == 200) {
						that.user_info = res.data.user_info

					}
				});
			},
			backPage() {
				uni.navigateBack({});
			},
			gotopage(e) {
				let url = e.currentTarget.dataset.url;
				uni.navigateTo({
					url: url
				});
			},
		},
		onPageScroll: function(Object) {
			//console.log(Object.scrollTop); //实时获取到滚动的值
			if (Object.scrollTop > 28) {
				this.scrrol = true;
				/* #ifdef APP-PLUS */
				/* #endif */
			} else if (Object.scrollTop < 28) {
				this.scrrol = false;
				/* #ifdef APP-PLUS */
				/* #endif */
			}
		},
	}
</script>

<style>
	.header {
		background-color: transparent !important;
	}

	.header .text {
		text-align: center;
	}

	.page_content {
		width: 92%;
		margin: 0 auto;
	}

	.scrrolHeader {
		width: 100%;
		background-color: #1A1A1A !important;

	}

	.assets_list {
		width: 100%;
		padding: 5vw;
		background-color: #1A1A1A;
		border-radius: 4vw;
		margin-top: 4%;
	}

	.assets_list .type_box {
		width: 100%;
		display: flex;
		align-items: center;
	}

	.assets_list .type_box .icon {
		width: 6vw;
		margin-right: 3vw;
	}

	.assets_list .type_box .icon image {
		width: 100%;
	}

	.assets_list .type_box .title {
		font-size: 4vw;
		color: #fff;
		font-weight: bold;
		flex: 1;
	}

	.assets_list .type_box .text {
		font-size: 3.5vw;
		color: #7B7B7F;
	}

	.assets_list .type_box .arrow {
		font-size: 4vw;
		color: #7B7B7F;
	}

	.assets_list .num_box {
		font-size: 10vw;
		color: #fff;
		font-weight: bold;
		margin-top: 3vw;
		width: 100%;
		overflow: hidden;
		overflow-x: auto;
	}

	.assets_list .menu_box {
		width: 100%;
		margin-top: 3vw;
		display: flex;
	}

	.assets_list .menu_box .menu {
		flex: 1;
	}

	.assets_list .menu_box .menu:nth-child(1) {
		border-right: 1px solid #404040;
		padding-right: 3.5vw;
	}

	.assets_list .menu_box .menu:nth-child(2) {
		padding-left: 4vw;

	}

	.assets_list .menu_box .menu .name {
		font-size: 3.5vw;
		color: #666666;
	}

	.assets_list .menu_box .menu .num {
		font-size: 4vw;
		color: #fff;
		font-weight: bold;
		margin-top: 1vw;
	}

	.assets_list .button_box {
		width: 100%;
		margin-top: 3vw;
		display: flex;
	}


	.assets_list .button_box .button {
		flex: 1;
		border-radius: 2vw;
		height: 12vw;
		background-color: #2A2A2A;
		font-size: 3.6vw;
		color: #fff;
		display: flex;
		align-items: center;
		justify-content: center;
	}


	.assets_list .button_box .button:nth-child(2) {
		margin-left: 4%;
	}

	.buttonColor01 {
		background-color: #238E76 !important;
	}

	.buttonColor02 {
		background-color: #0155FF !important;
	}

	.buttonColor03 {
		background-color: #7752EC !important;
	}
</style>